<script setup lang="ts">
import { type PropType, watchEffect } from "vue";

defineOptions({ name: "console-debugger" });

const props = defineProps({
  message: { type: String },
  variable: { type: [Object, Array, Number, Boolean, String, BigInt, Symbol] as PropType<any> },
});

watchEffect(() => {
  if (!!props.message) {
    console.log(`[console-debugger]`, props.message, props.variable);
  } else {
    console.log(`[console-debugger]`, props.variable);
  }
});
</script>

<template>
  <slot />
</template>
